<template>
    <div>
        <div class="top1">
            <img src="../../../../../assets/images/home.png" alt="">
            <div class="top1-right">
                <h2 style="margin-top: 20px;">本期活动GMX</h2>
                <b id="b1">1523.53w</b>
                <div class="leimu">
                    <p>
                        <span>类目一</span>
                        <b>53w</b>
                    </p>
                    <p>
                        <span>类目二</span>
                        <b>53w</b>
                    </p>
                    <p>
                        <span>类目三</span>
                        <b>53w</b>
                    </p>
                </div>

            </div>
        </div>

    </div>
</template>

<script setup>

</script>

<style scoped lang="scss">
.top1 {
    width: 550px;
    height: 195px;
    border-radius: 20px;
    background-color: #2969ff;
    margin-right: 10px;
    display: flex;

    #b1 {
        display: inline-block;
        width: 320px;
        height: 40px;
        font-size: 30px;
        border-bottom: #fff solid 1px
    }

    .top1-right {
        width: 300px;
        height: 195px;
        color: aliceblue;

        .leimu {
            width: 320px;
            justify-content: space-around;
            display: flex;
            line-height: 50px;

            span {
                display: inline-block;
                font-size: 28px;
                width: 90px;
                height: 30px;
            }

            b {
                font-size: 30px;
            }
        }
    }
}
</style>
